import Vue from "vue";
import axios from "axios";

const list = Vue.component("list", {
  template: `
      <div>
          <div class="" v-for="item in listData">
              <img v-bind:src="item.images[0]" alt="" srcset="">
              <h2><router-link to="/detail">{{ item.title }}</router-link></h2>
          </div>
      </div>`,
  data() {
    return {
      listData: [],
    };
  },
  created() {
    var _this = this;
    axios.get("./list-data.json").then(function (response) {
      console.log(response.data.stories);
      _this.listData = response.data.stories;
    });
  },
});

export default list;
